<template>
	<div class="public-attribute">
		
		<div class="header-fixed">
			<video-header></video-header>
			<video-nav></video-nav>
		</div>
		
		<video-list 
					:videoList='videoList'
		>
		</video-list>
		
	</div>
</template>

<script>
	import axios from 'axios'
	import VideoHeader from '../../common/CommonHeader'
	import VideoNav from '../../common/CommonNav'
	import VideoList from './components/List'
	export default {
		name: 'hot',
		components: {
			VideoHeader,
			VideoNav,
			VideoList
		},
		data () {
			return {
				videoList: []
			}
		},
		methods: {
			getVideoData () {
				axios({
					method: 'get',
					url: '/video_lists'
				})
				.then( response=> {
					this.videoList = response.data.data
				})
				.catch( error=> {
					console.log('REQUEST ERROR:' + error)
				})
			}
		},
		mounted () {
			this.getVideoData()
		}
	}
</script>
